import React from 'react'
import Star from './star.js'
import querystring from "query-string"
import { getfldp,getxzfldp,getfldp1 } from '../../api/index.js'
import {withRouter} from "react-router-dom"
@withRouter
class Listmain extends React.Component {
    constructor() {
        super()
        this.state = {
            listarr: []
        }
    }
    handleclicklist(id){
        // console.log(id)
        this.props.history.push("/shangpinxq?restaurantId="+id)
        let routePath= this.props.location.pathname+this.props.location.search
        localStorage.setItem("routePath",routePath)
    }
    componentDidMount() {
       
      
        let res = querystring.parse(this.props.location.search)
        console.log(res)
        let jingweidu = JSON.parse(localStorage.getItem("geohash"))
        // console.log(jingweidu)
        // console.log(this.props.data)
        let obj ={
            id:res.sortid,
            latitude:jingweidu.latitude,
            longitude:jingweidu.longitude,
            order:1
        }
        console.log(obj)
        // getfldp1(obj).then(res => {
        //     console.log("========================")
        //     this.setState({
        //         listarr: res.data
        //     })
        // }).catch(err=>{
        //     console.log(err)
        // })

    }
    componentWillReceiveProps(newp,news){
        console.log(newp)
        let {data,odata} = newp
        console.log(data)
        let obj ={
            latitude:data.latitude,
            longitude:data.longitude,
            id:data.id,
            order:odata.order
        }
        console.log(obj)
        // if(this.props===newp){
        //     return
        // }
        // console.log(newp)
        
  
          
            getfldp(obj).then(res=>{
                console.log("============")
            
                this.setState({
                    listarr:res.data

                })
            })
       
        
        // getxzfldp(newp.odata).then(res=>{
        //     this.setState({
        //         listarr: res.data
        //     })
        // })







    }
    // shouldComponentUpdate(nextprops,nextstate){
    //      console.log(nextprops)
    //      if(nextprops.data.id==this.props.data.id){
    //          return false
    //      }else{
    //         return true
    //      }
        
    // }
    // componentWillUpdate(nextprops){

    // }

    render() {
        let { listarr } = this.state
        let oli = listarr.map((item) => {
            // console.log(item)
            return (
                <li className='shop_li' key={item.id} onClick={this.handleclicklist.bind(this,item.id)}>
                    <img src={`//elm.cangdu.org/img/${item.image_path}`} alt="" />
                    <div className='shop_li_rightdiv'>
                        <div className='shop_li_topl'>
                            <div className='shop_li_topl-left'>
                                <span className='shop_li_pp'>品牌</span>
                                <p className='shop_li_title'>{item.name}</p>
                            </div>
                            <span>保准票</span>
                        </div>

                        <div className='shop_li_middle'>
                            <div className='shop_li_middle_l'>
                                <Star></Star>
                                <p>
                                    <span className='shop_li_middle_pf'>{item.rating}</span>
                                    <span>月售
                        <i>{item.recent_order_num}</i>
                                        单
                    </span>

                                </p>
                            </div>


                            <span className='list_fnzslg'>
                                <i>蜂鸟专送</i>
                                <i>准时达</i>
                            </span>

                        </div>


                        <div className='shop_li_bottom'>
                            <div>
                                <p>
                                    ￥
                        <span className='shop_li_bottom_psf'>
                                       {item.float_minimum_order_amount}
                        </span>
                                    起送/配送费约￥
                        <span>
                                        {item.float_delivery_fee}
                        </span>
                                </p>
                            </div>

                            <div>
                                    <span>{item.distance}</span>/
                                    <span>{item.order_lead_time}</span>
                       </div>


                        </div>


                    </div>
                </li>
            )
        })
        return (
            <div>
                <ul className='tabthree-shop_lists'>
                    {oli}
                </ul>
            </div>
        )
    }
}
export default Listmain